<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity4">
<head>
    <head th:include="common/common_head :: commonHead('权限管理')"/>
    <link rel="stylesheet" th:href="@{/static/plugin/beone/main.css}"/>
</head>
<body>
<div class="layui-col-md13">
    <div class="layui-btn-group">
        <span sec:authorize-expr="hasAnyAuthority('sys.menu.showAdd')">
            <button class="layui-btn layui-btn-normal" data-type="add">
                <i class="layui-icon">&#xe608;</i>新增
            </button>
        </span>
    </div>
    <button class="layui-btn layui-btn-sm icon-position-no-button" id="refresh"
            onclick="javascript:location.replace(location.href);">
        <i class="layui-icon i-icon" style="font-size: 21px">&#xe669;</i>
    </button>
</div>
<table id="menuTree" class="layui-table" lay-filter="menuTree"></table>
</body>
<script type="text/javascript" th:inline="javascript">/*<![CDATA[*/
    var deletePerm = /*[[${#authorization.expression("hasAnyAuthority('sys.menu.delete')")}]]*/ false;
    var updatePerm = /*[[${#authorization.expression("hasAnyAuthority('sys.menu.update')")}]]*/ false;
    function del(nodeId, text) {
        var index = layuiUtils.confirm('确定删除权限[<label style="color: #00AA91;">' + text + '</label>]?',function () {
            var url = /*[[@{/system/permission/delete}]]*/ "/system/permission/delete";
            layuiUtils.doRequest(url, {nodeId:nodeId}, function () {
                layer.close(index);
                location.replace(location.href);
            });
        })
    }
    function update(nodeId) {
        var url = /*[[@{/system/permission/showUpdate}]]*/ "/system/permission/showUpdate";
        url += '?nodeId=' + nodeId
        layuiUtils.dialog('permisUpdate','修改权限', url, 800, 550);
    }

    function detail(nodeId) {
        var url = /*[[@{/system/permission/showUpdate}]]*/ "/system/permission/showUpdate";
        url += '?detail=true&nodeId=' + nodeId
        layuiUtils.dialog('permisDetail','查看权限详情', url, 800, 550);
    }

    var baseUrl = /*[[@{/static/plugin/treetable/}]]*/ '/static/plugin/treetable/';
    layui.config({  base: baseUrl,});
    layui.use(['table','treetable', 'layer'], function () {
        var menus = [];
        var urlPermission = /*[[@{/system/permission/list}]]*/ "/system/permission/list";
        jQuery.ajax({url: urlPermission, async: false, type: 'post', dataType:"json",
            success: function (result) {
                for(var n in result.data){
                    var item = result.data[n];
                    item.id = item.nodeId;
                    item.pid = item.pid ? item.pid : 0;
                    item.title = item.nameNode;
                    menus.push(item);
                }
            }
        });

        var layer = layui.layer, treetable = layui.treetable;
        treetable.render({
            treeColIndex:1, //树形图标显示在第几列
            treeSpid:0,//最上级的父级id值
            elem: '#menuTree',
            treeIdName:"nodeId", //id字段的名称
            treePidName:"pid", //pid字段的名称
            treeDefaultClose: false,
            treeLinkage: true, //父级展开时是否自动展开所有子级
            data: menus,
            page: false,
            cols: [[
                {type: 'numbers'},
                { field: 'nameNode', title: '权限名称', width: '15%' },
                { field: 'nodeUrl', title: '权限URL', width: '20%' },
                { field: 'nodeCode', title: '权限', width: '15%' },
                { field: 'typeNode', title: '类型', width: '5%' , templet:function (d) {
                    return d.typeNode == '03' ? '菜单' : '功能';
                }},
                { field: 'icon', title: '图标', width: '5%', templet:function (d) {
                    return '<i class="layui-icon">' + (d.icon ? d.icon : '') + '</i>';
                }},
                { field: 'isIndex', title: '状态', width: '5%', templet:function (d) {
                    return  d.isIndex == 1 ? '启用' : '停用';
                }},
                {field: 'actions',title: '操作',width: '15%', templet:function (d) {
                    var str = "";
                    if(updatePerm){
                        str = '<a class="layui-btn layui-btn-primary layui-btn-xs" onclick="detail(\'' + d.nodeId + '\')"><i class="layui-icon">&#xe615;</i> 查看</a>';
                        str +=  '<a class="layui-btn layui-btn-xs  layui-btn-normal" onclick="update(\'' + d.nodeId + '\')"><i class="layui-icon">&#xe642;</i> 编辑</a>'; //列渲染
                    }

                    if (!d.isParent && deletePerm) {
                        str += '<a class="layui-btn layui-btn-danger layui-btn-xs" onclick="del(\'' + d.nodeId
                                + '\', \'' + d.nameNode + '\')"><i class="layui-icon">&#xe640;</i> 删除</a>';
                    }
                    return str;
                }}
            ]],
            done: function () {
                layer.closeAll('loading');
            }
        })

        var $ = layui.$, active = {
            add: function () {
                var url = /*[[@{/system/permission/showAdd}]]*/ "/system/permission/showAdd";
                layuiUtils.dialog('permisAdd','添加权限', url, 800, 550);
            }
        }
        $('.layui-btn-group .layui-btn').on('click', function () {
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });
    });
/*]]>*/</script>
</html>